<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/mui.picker.min.css" rel="stylesheet" />
		<link href="../../css/mui.poppicker.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../css/app.min.css" />
		<style type="text/css">
			.mui-popover {
				display: none;
				position: fixed;
				width: 80%;
				height: auto;
				border-radius: 0;
				left: 50%;
				top: 50%;
				margin: 0 auto;
				z-index: 9999;
				background-color: #fff;
				-webkit-transform: translateX(-50%) translateY(-50%);
				-moz-transform: translateX(-50%) translateY(-50%);
				-ms-transform: translateX(-50%) translateY(-50%);
				transform: translateX(-50%) translateY(-50%);
			}
			
			.mui-popover-arrow {
				display: none;
			}
			
			.mui-title {
				color: #208AFE;
			}
			
			.mui-content {
				background-color: #F7F7F7;
			}
			
			.huo-div {
				padding-top: 5%;
			}
			
			.huo-div input {
				padding-left: 0!important;
				margin-bottom: 0;
				border: hidden;
			}
			
			.divcolor {
				color: red;
			}
			
			.divv1 {
				font-size: 90%;
				margin-top: 0;
				display: flex;
				align-items: center;
			}
			
			.divv1 input,
			textarea {
				width: 93%;
				border: 0;
				color: #000000;
				font-size: 95%;
				margin-bottom: 0;
				max-height: 80%;
				padding-left: 0!important;
			}
			
			.divv2 {
				font-size: 90%;
				margin-top: 0;
				display: flex;
				align-items: center;
			}
			
			.divv2 input {
				width: 70%;
				border: hidden;
				color: #000000;
				font-size: 95%;
				margin-bottom: 0;
			}
			
			#streettext {
				padding-left: 0;
				font-size: 85%;
				margin-bottom: 0;
				border: 0;
			}
			
			.renwu-dv {
				padding-left: 6%;
				border-left: 5px solid #208AFE;
				border-radius: 2px;
			}
			
			.paddingg-div {
				margin-top: 12px;
				width: 100%;
				padding-top: 15px!important;
			}
			
			.bgcolor-div {
				background-color: white;
				padding: 0 5%;
			}
			
			.text1 {
				font-size: 80%;
				color: #98989C;
				display: block;
			}
			
			.padd-div {
				margin-top: 4%;
			}
			
			.write-text {
				font-size: 80%;
				border-color: #EDEDED;
			}
			
			.huo-p {
				color: #208AFE;
				font-size: 100%;
			}
			
			.huo-p text {
				color: aqua;
			}
			
			#mui-btn {
				width: 100%;
				margin-top: 8%;
				font-size: 16px;
			}
			
			.borderbottom {
				border-bottom: 1px solid #F7F7F7;
			}
			
			.paddingflex {
				width: 100%;
				display: flex;
				align-items: center;
				font-size: 90%;
			}
			
			.paddingflex img {
				position: absolute;
				right: 5%;
				margin-top: 0;
				margin-bottom: 0;
				width: 4.5%;
				margin-top: 2px;
			}
			
			.type-sapn {
				position: absolute;
				right: 10%;
				margin-top: 0;
				color: #ADADAD;
				font-size: 95%;
			}
			
			#openPopoveritem {
				display: none;
			}
		</style>
	</head>

	<body style="background-color: #FFFFFF;">
		<!--弹出菜单-->
		<div id="pop" class="mui-popover">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a href="#" data-index="0">校园发布</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" data-index="1">社会发布</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" data-index="2">同步到校园和社会发布</a>
				</li>
			</ul>
		</div>

		<!--弹出菜单-->
		<div id="popitem" class="mui-popover">
			<ul class="mui-table-view popitem-ul">
				<li class="mui-table-view-cell">
					<a href="#" data-index="0">默认</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" data-index="1">对本校认证过的开放</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#" data-index="2">对本校(含学生证)认证过的开放</a>
				</li>
			</ul>
		</div>

		<!--页面主体-->
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">发布兼职</h1>
		</header>

		<div class="mui-content " id="mui-content">
			<div class="bgcolor-div">
				<div class="huo-div"><input type="text" id="input1" placeholder="兼职标题" /></div>
				<div class="divv1 divcolor"><input type="text" id="input2" placeholder="输入薪水（例如：80元/天）"></div>
				<div class="divv1">
					<textarea rows="1" id="showCityPicker" placeholder="请选择省-市-区"></textarea>
					<img id='showCityPicke' src="../../images/dwei.png" style="width: 6%;">
				</div>
				<textarea id="streettext" rows="1" cols="30" placeholder="输入街道等详细信息"></textarea>
			</div>

			<div class="bgcolor-div paddingg-div">
				<div class="renwu-dv">
					<p class="huo-p">任务要求</p>
				</div>
				<div class="divv2">结算周期：<input type="text" id="input4" placeholder="完工结"></div>
				<div class="divv2">招聘人数：<input type="text" id="input5" placeholder="10人"></div>
				<div class="divv2">性别要求：<input type="text" id="input6" placeholder="男女不限"></div>
				<div class="renwu-dv padd-div">
					<p class="huo-p">详细内容</p>
				</div>
				<textarea name="" class="write-text" id="txtContent" rows="2" cols="30" placeholder="此处输入...." onkeyup="ResizeTextarea();"></textarea>
				<div class="renwu-dv">
					<p class="huo-p">工作时间</p>
				</div>
				<div class="divv2">起始时间：<input type="text" id="input7" placeholder="11月1日上午8:00"></div>
				<div class="divv2">结束时间：<input type="text" id="input8" placeholder="11月1日下午18:00"></div>

				<div class="renwu-dv padd-div">
					<p class="huo-p">联系方式</p>
				</div>
				<div class="divv2">手机号码：<input type="text" id="input9" placeholder="输入有效手机号"></div>
				<div class="divv2">咨询账号：<input type="text" id="input11" placeholder="默认为自己账号"></div>

				<div class="renwu-dv padd-div">
					<p class="huo-p">权限设置</p>
				</div>
				<div class="paddingflex borderbottom" id="openPopover">发布类型<span class="type-sapn" id="type-sapn"></span><img src="../../images/toserach.png"></div>
				<div class="paddingflex" id="openPopoveritem">谁能看见<span id="type-sapn-item" class="type-sapn"></span><img src="../../images/toserach.png"></div>

				<button type="button" class="mui-btn mui-btn-blue" id="mui-btn">确认发布</button>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/immersed.js"></script>
		<script src="../../js/mui.picker.min.js"></script>
		<script src="../../js/mui.poppicker.js"></script>
		<script src="../../js/popover.js"></script>
		<script src="../../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/toidrefresh.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			//textarea自适应说说高度
			function ResizeTextarea() {
				// 最小高度  
				var minRows = 2;
				// 最大高度，超过则出现滚动条  
				var maxRows = 100;
				var t = document.getElementById('txtContent');
				if(t.scrollTop == 0) t.scrollTop = 1;
				while(t.scrollTop == 0) {
					if(t.rows > minRows)
						t.rows--;
					else
						break;
					t.scrollTop = 1;
					if(t.rows < maxRows)
						t.style.overflowY = "hidden";
					if(t.scrollTop > 0) {
						t.rows++;
						break;
					}
				}
				while(t.scrollTop > 0) {
					if(t.rows < maxRows) {
						t.rows++;
						if(t.scrollTop == 0) t.scrollTop = 1;
					} else {
						t.style.overflowY = "auto";
						break;
					}
				}
			}
			(function($) {
				$.init();
				var city = '';
				var areea = '';
				//获取地址信息
				$.ready(function() {
					var _getParam = function(obj, param) {
						return obj[param] || '';
					};
					var cityPicker3 = new $.PopPicker({
						layer: 3
					});
					cityPicker3.setData(cityData3);
					var showCityPickerimg = document.getElementById('showCityPicke');
					var cityResult3 = document.getElementById('showCityPicker');
					showCityPickerimg.addEventListener('tap', function(event) {
						cityPicker3.show(function(items) {
							cityResult3.value = _getParam(items[0], 'text') + "-" + _getParam(items[1], 'text') + "-" + _getParam(items[2], 'text');
							city = _getParam(items[1], 'text');
							areea = _getParam(items[2], 'text');
							//返回 false 可以阻止选择框的关闭
							//return false;
						});
					}, false);
					cityResult3.addEventListener('tap', function(event) {
						cityPicker3.show(function(items) {
							cityResult3.value = _getParam(items[0], 'text') + "-" + _getParam(items[1], 'text') + "-" + _getParam(items[2], 'text');
							city = _getParam(items[1], 'text');
							areea = _getParam(items[2], 'text');
							//返回 false 可以阻止选择框的关闭
							//return false;
						});
					}, false);
				})
				
				
				var old_back = mui.back;
				//重写返回事件
				$.back = function(){
					var title = document.getElementById('input1');
					var money = document.getElementById('input2');
					var adress = document.getElementById('streettext');
					var jsday = document.getElementById('input4');
					var needren = document.getElementById('input5');
					var sex = document.getElementById('input6');
					var startimt = document.getElementById('input7');
					var endtime = document.getElementById('input8');
					var tel = document.getElementById('input9');
					var card = document.getElementById('input11');
					var allcont = document.getElementById('txtContent');
					var type = document.getElementById('showCityPicker');
	                //判断是否打开图片预览，如果是，就先关掉图片，否则直接关闭当前页面
	                if(document.querySelector(".mui-preview-in")){
	                    $.previewImage().close();
	                    return ;
	                }else if(title.value == "" && money.value == "" && adress.value == "" && jsday.value == "" && needren.value == "" && sex.value == "" && startimt.value == "" && endtime.value == "" && tel.value == "" && card.value == "" && allcont.value == "" && type.value == "") {
						old_back();
					} else {
						$.confirm('确认放弃发表？', ['取消', '确认'], function(e) {
							if(e.index == 0) {
								old_back()
							}
						})
					}
	    			
	            }

				$.plusReady(function() {
					starbar();
					plus.navigator.setStatusBarStyle('dark');

					var viewwidth = document.body.clientWidth;
					mui(".paddingflex").each(function() {
						this.style.cssText = "padding: -webkit-calc(" + viewwidth * 0.03 + "px) 0"
					})
					
					

					//弹出菜单
					var a = false;
					var b = false;
					var fleixing = '';
					var quanxian = '0';
					var pop = new popover('#pop');
					var fbtype = document.getElementById('type-sapn');
					var popitem = new popover('#popitem');
					var fbtypeitem = document.getElementById('type-sapn-item');
					var wholook = document.getElementById('openPopoveritem');
					document.querySelector('#openPopover').addEventListener('tap', function() {
						pop.open();
						a = true;
					})
					document.querySelector('#openPopoveritem').addEventListener('tap', function() {
						popitem.open();
						b = true;
					})
					mui('.mui-table-view').on('tap', 'li a', function() {
						if(this.textContent == '校园发布') {
							wholook.style.display = 'block'
						} else if(this.textContent != '校园发布' && b == true) {
							wholook.style.display = 'block'
						} else {
							wholook.style.display = 'none'
						}
						if(a == true) {
							fbtype.textContent = this.textContent;
							fleixing = String(this.getAttribute('data-index'));
							a = false;
							pop.close();
						} else {
							fbtypeitem.textContent = this.textContent;
							quanxian = String(this.getAttribute('data-index'));
							b = false;
							popitem.close();
						}
					})

					document.getElementById('mui-content').style.paddingBottom = "-webkit-calc(" + viewwidth * 0.13 + "px)";

					document.getElementById('mui-btn').addEventListener('tap', function() {
						mui.toast('发布成功!');
												mui.app_refresh("jianzhi.html");
												var preView = plus.webview.currentWebview().opener(); //触发上一个页面刷新图片事件
                         	mui.fire(preView,'backfabu',{});
												old_back();
//						var title = document.getElementById('input1').value;
//						var money = document.getElementById('input2').value;
//						var adress = document.getElementById('streettext').value;
//						var jsday = document.getElementById('input4').value;
//						var needren = document.getElementById('input5').value;
//						var sex = document.getElementById('input6').value;
//						var startimt = document.getElementById('input7').value;
//						var endtime = document.getElementById('input8').value;
//						var tel = document.getElementById('input9').value;
//						var card = document.getElementById('input11').value;
//						var allcont = document.getElementById('txtContent').value;
//						console.log(title + '----' + money + '----' + city + '----' + areea + '----' + adress + '----' + card + '----' + allcont + '----' + jsday + '----' + endtime + '----' + needren + '----' + startimt + '----' + sex + '----' + tel + '----' + fleixing + '----' + quanxian);
//						if(areea != '' && fleixing != '' && city != '' && title != '' && money != '' && jsday != '' && needren != '' && sex != '' && startimt != '' && endtime != '' && tel != '' && card != '') {
//							var btnArray = ['确定', '取消'];
//							mui.confirm('确认发布？', btnArray, function(e) {
//								if(e.index == 0) {
//									mui.ajax('https://www.lunyuwang.com/taskController/publishTask', {
//										data: {
//											lytask_Title: title,
//											lytask_Pay: money,
//											lytask_City: city,
//											lytask_Area: areea,
//											lytask_Adress: adress,
//											lytask_Card: card,
//											lytask_Text: allcont,
//											lytask_Cycle: jsday,
//											lytask_End: endtime,
//											lytask_Number: needren,
//											lytask_Start: startimt,
//											lytask_Sex: sex,
//											lytask_Tel: tel,
//											lyuser_Card: plus.storage.getItem("card"),
//											lytask_FLeiXing: fleixing,
//											lytask_Authority: quanxian
//										},
//										crossDomain: true, //强制使用5+跨域
//										dataType: 'json', //服务器返回json格式数据
//										type: 'get', //HTTP请求类型
//										timeout: 10000, //超时时间设置为10秒；
//										//processData: false,
//										headers: {
//											'Content-Type': 'application/x-www-form-urlencoded'
//										},
//										success: function(data) {
//											if(data.state == 1){
//												mui.toast('发布成功!');
//												mui.app_refresh("jianzhi.html");
//												old_back(plus.navigator.setStatusBarStyle('dark'));
//											}else{
//												mui.toast('发布失败!');
//											}
//											
//										},
//										error: function(xhr, type, errorThrown) {
//											mui.toast('发布异常!')
//										}
//									})
//								}
//							})
//						} else {
//							mui.alert('所有内容不能为空!');
//						}
					})
				})
			})(mui);
		</script>
	</body>

</html>